<%@ page language="java" contentType="text/html; charset=utf-8" pageEncoding="UTF-8"%>
<%@page import="java.sql.Connection" %>
<%@page import="java.sql.Statement" %>
<%@page import="java.sql.PreparedStatement" %>
<%@page import="java.sql.ResultSet" %>
<%@page import="java.sql.SQLException" %>
<%@page import="java.util.List" %>
<%@page import="java.util.ArrayList" %>
<%@page import="bean.User" %>

<%@page import="utils.DBCPUtil" %>
<%@page import="org.apache.commons.dbutils.QueryRunner" %>
<%@page import="org.apache.commons.dbutils.handlers.BeanHandler" %>
<%@page import="org.apache.commons.dbutils.handlers.BeanListHandler" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>用户管理</title>
<script src="js/ajax.js"></script>
<style>
input{
	width:100%;
	height:25px;
}
a{
	text-decoration: none;
}
li a{
	color:#555555;
	font-size:20px;
	border:1px;
	display:block;
	width:100%;
	height:30px;
	padding-top:10px;
    text-align: center;
}

li a:hover{
    background-color:#E7E7E7;
}

button{
	width:50px;
	margin:5px;
	margin-left:7%;
}

tr th{
	height:30px;
}

tr.scrolltype{
	display:table; 
	width: 100%; 
	height:30px;
	table-layout:fixed;
}

tr.scrolltype:hover{
	background-color:#FFFFC0;
}

.first{
	width:80px;
}

</style>
</head>
<body>
<div class="title" style="width:100%; height:80px; background-color:#7080A6; color:white; text-align:center; padding-top:8px; box-sizing:border-box;">
	<h1 class="thetitle">邮件服务器管理界面</h1>
</div>

<div class="left" style="float:left; background-color:#D2DFF0; width:15%; height:500px;"> 
	<ul style="list-style:none; margin:0px; padding:0px; margin-top:20px;">
		<li><a href="serverManage.jsp">服务器管理</a></li>
		<li><a href="userManage.jsp" style="background-color:#E7E7E7">用户管理</a></li>
		<li><a href="logManage.jsp">日志管理</a></li>
		<li><a href="sendMails.jsp">群发邮件</a></li>
	</ul>
</div>
<div class="right" style="float:left; width:85%; height:500px;">
	<form action="./Login_out">
			<button style="margin-left: 95%; margin-top: 3px; display: inline;"
				type="submit">退出</button>
	</form>
	

	<div id="userlist" style="float:left; width:60%; height:100%;">
		<p style="margin-left:5%; margin-top:30px;">用户列表：</p>
		<div>
		<table  border="1px" cellspacing="0" style="width:90%;  margin-left:5%; background-color:#F7F7F7;">
			<thead style="display:table; width: calc(100% - 1em); table-layout:fixed; background-color:#BABABA;">
				<tr>
					<th class="first">序号</th>
					<th>用户ID</th>
					
					<th>用户权限</th>
				</tr>
			</thead>
			
			<tbody id="datalist" style="display:block; height:300px; overflow-y:scroll; text-align:center;">
				<%
					QueryRunner qr = new QueryRunner(DBCPUtil.getDataSource());
					List<User> userlist = new ArrayList<User>();
					try {
						userlist = qr.query("select * from user", new BeanListHandler<>(User.class));
					} catch (SQLException e) {
						// TODO Auto-generated catch block
						e.printStackTrace();
					}
					
					if(request.getAttribute("userlist")!=null){
						List<User> l = (List<User>)request.getAttribute("userlist");
						userlist = l;
					}
					int count=0;
					for (User u : userlist) {
					count++;
					
				%>
				<tr class="scrolltype" onclick="getinfo(this)">
					<td class="first"><%=count%></td>
					<td><%=u.getUser_id()%></td>
					
					<td><%=u.isAdmin()%></td>
				</tr>
				<%
				}
				%>
			</tbody>
		</table>
		</div>
	</div>
	<div id="action" style="float:left; width:40%;">
		<div style="margin-left:5%; margin-top:30px;">
		<span>操作类型：</span>
			<select style="  height:20px;" onchange="changecontent(this.value)">
				<option>增加用户</option>
				<option>修改用户信息</option>
				<option>删除用户</option>
				<option>查看用户信息</option>
			</select>
			
			<button type="button" onclick="showall()" style="width:100px;">显示全部用户</button>
		</div>
		
		<div id="actcontent">
		
		<table id="searchbox" cellspacing="5"  style="display:none; background-color:#F7F7F7;  text-align:right; width:90%; margin-left:5%;  margin-top:20px; padding:5px;">
			<tr>
				
					<td style="width:25%;">查询用户：</td>
					<td>
						<input id="input" name="input" placeholder="输入搜索关键字"/>
					</td>
					<td><button type="button" style="width:50px;" onclick="searchUser()">查询</button></td>
					
			</tr>
			<tr>
				<td>查询条件：</td>
				<td style="text-align:left;">
					<select id="condition" name="condition" style=" height:20px;" onchange="changecontent(this.value)">
						<option>用户ID</option>
						<option>用户权限</option>
					</select>
				</td>
			</tr>
		</table>
		
		
		<form id="add" method="post" action="./addUser">
		<table  id="addinfo" cellspacing="5"  style="background-color:#F7F7F7;  text-align:right; width:90%; margin-left:5%;  margin-top:20px; padding:20px;">
			
			<tr>
				<td style="width:25%;">用户ID：</td>
				<td><input name="userid"/></td>
			</tr>
			<tr>
				<td>用户密码：</td>
				<td><input name="password"/></td>
			</tr>
			
			<tr>
				<td>用户权限：</td>
				<td style="text-align:left;">
					<select name="authority" style=" height:20px;">
						<option>普通用户</option>
						<option>管理员</option>
					</select>
				</td>
			</tr>
			
		</table>
		<table id="addbtn" cellspacing="5"  style="background-color:#F7F7F7; width:80%; text-align:right; width:90%; margin-left:5%;  padding:10px;">
			
			<tr><td style="text-align:center;"><button type="submit" style="width:100px;">增加</button></td></tr>
			
		</table>
		</form>
		
		<form id="other" method="post" action="">
		<table  id="otheract" cellspacing="5"  style="display:none; background-color:#F7F7F7;  text-align:right; width:90%; margin-left:5%;  margin-top:20px; padding:20px;">
			
			<tr>
				<td style="width:25%;">用户ID：</td>
				<td><input id="userid" name="userid" autocomplete="off"/></td>
			</tr>
			
			<tr>
				<td>用户密码：</td>
				<td><input type="password" id="password" name="password" autocomplete="off"/></td>
			</tr>
			
			<tr>
				<td>用户权限：</td>
				<td style="text-align:left;">
					<select id="authority"  name="authority" style=" height:20px;" onchange="changecontent(this.value)">
						<option value="user">普通用户</option>
						<option value="manager">管理员</option>
					</select>
				</td>
			</tr>
			
		</table>
		
		
		
		<table id="btnblock" cellspacing="5"  style="display:none;background-color:#F7F7F7; width:80%; text-align:right; width:90%; margin-left:5%;  padding:10px;">
			
			<tr><td style="text-align:center;"><button type="submit" id="btn" style="width:100px;">增加</button></td></tr>
			
		</table>
		</form>
		
		</div>
		

		
	</div>
</div>
<div class="copyright" style="clear:both; width:100%; height:50px; background-color:#7080A6; color:white; text-align:center; box-sizing:border-box; padding-top:1px;">
	<h3>版权所有：邮件服务器</h3>
</div>

<script type="text/javascript">
	function changecontent(str){
		if(str=="增加用户"){
			document.getElementById("searchbox").style.display = 'none';
			document.getElementById("addinfo").style.display = '';
			document.getElementById("otheract").style.display = 'none';
			document.getElementById("btnblock").style.display = 'none';
			document.getElementById("addbtn").style.display = '';
			//document.getElementById("btn").innerText = '增加';
			//document.getElementById("other").action = "./addUser";
		}
		else if(str=="修改用户信息"){
			document.getElementById("searchbox").style.display = '';
			document.getElementById("addinfo").style.display = 'none';
			document.getElementById("otheract").style.display = '';
			document.getElementById("btnblock").style.display = '';
			document.getElementById("addbtn").style.display = 'none';
			document.getElementById("btn").innerText = '保存修改';
			
			document.getElementById("userid").readOnly = true;
			document.getElementById("password").readOnly = false;
			document.getElementById("authority").disabled = "";
			//定义表单执行的动作为修改用户信息
			document.getElementById("other").action = "./alterUser";
		}
		else if(str=="删除用户"){
			document.getElementById("searchbox").style.display = '';
			document.getElementById("addinfo").style.display = 'none';
			document.getElementById("otheract").style.display = '';
			document.getElementById("btnblock").style.display = '';
			document.getElementById("addbtn").style.display = 'none';
			document.getElementById("btn").innerText = '删除';
			
			document.getElementById("userid").readOnly = true;
			document.getElementById("password").readOnly = true;
			document.getElementById("authority").disabled = "disabled";
			//定义表单执行的动作为删除用户
			document.getElementById("other").action = "./delUser";
		}
		else if(str=="查看用户信息"){
			//查看信息用的是修改信息的input
			document.getElementById("searchbox").style.display = '';
			document.getElementById("addinfo").style.display = 'none';
			document.getElementById("otheract").style.display = '';
			document.getElementById("btnblock").style.display = 'none';
			document.getElementById("addbtn").style.display = 'none';
			
			document.getElementById("userid").readOnly = true;
			document.getElementById("password").readOnly = true;
			document.getElementById("authority").disabled = "disabled";
		}
	}
	
	function getinfo(obj){
		var cells = obj.getElementsByTagName("td");
		other.userid.value=cells[1].innerHTML;
		//other.password.value = cells[2].innerHTML;
		other.password.value="";
		console.log(other.password.value);
		other.password.placeholder="******";
		if(cells[2].innerHTML=="0"){
			other.authority.value="user";
		}else{
			other.authority.value="manager";
		}
	}
</script>
</body>
</html>